<template>
  <div class="w-[226px] h-[151px] relative bg-white">
    <div class="flex justify-center w-full items-center">
      <div class="text-center font-semibold">上海920医疗中心</div>
    </div>
    <div class="flex w-full mb-0 pb-0 relative">
      <div class="w-full relative z-20">
        <div class="text-sm">装备名称：{{ rowData.equipmentName || '' }}</div>
        <div class="text-sm mt-1">配置低点：{{ rowData.configAddr || '' }}</div>
        <div class="text-sm mt-1">型号：{{ rowData.model || '' }}</div>
        <div class="text-sm mt-1">使用人：{{ rowData.userEmpName || '' }}</div>
        <div class="text-sm mt-1">序列号：{{ rowData.equipmentNumber || '' }}</div>
      </div>
      <div class="absolute flex justify-center items-center z-10 right-0 -bottom-2">
        <QRCode :value="rowData.equipmentNumber" :bordered="false" :size="100" />
      </div>
    </div>
  </div>
</template>

<script setup>
import { QRCode } from 'ant-design-vue'

defineProps({
  rowData: {
    type: Object,
    default: () => ({})
  }
})
</script>
<style lang="less" scoped></style>
